<html>
	<head>
		<meta charset="utf-8">
		  <script src="lib/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
		<title>Razdavalnik</title>
		<link rel="shortcut icon" href="shopping.icon">
		<link rel="stylesheet" href="css/bootstrap.min.css" >
		<link rel="stylesheet" href="css/bootstrap-theme.min.css" >
		<script src="js/page1.js"></script>
		<script src="js/subCategoryMenu.js"></script>
		<script src="js/search.js"></script>
		<script src="js/profile-settings.js"></script>
	</head>
	
	
	<body onload="All()" id="body">
<!-- Navigation Bar -->
	<div class="navbar navbar-inverse navbar-static-top">
        <div class="container -fluid">
			<div class = "navbar-header-inverse">
				<button style="font-family:Gentium Basic;" type="button" class="btn navbar-brand navbar-btn" data-toggle="collapse" data-target=".navbar-collapse" onclick="GettoHomePage()">
				  <span class="icon-bar"></span>
				  <span class="icon-bar"></span>
				  <span class="icon-bar"></span>
				  <font color="#428bca">Razdavalnik</font> 
				</button>	
			</div>
			
			<!--Nav form with Search -->
			<form class="navbar-form navbar-left form-inline" action="CategorySearchServlet" method="post" >
				<div class= "form-group">
					<input type="text" name="whatToSearchFor" class="form-control" placeholder="Search by brand name">
				</div>
				<button onclick="submit" class="btn btn-primary navbar-btn" >
					<i class="glyphicon glyphicon-search"></i>
				</button>
				<div class="btn-group">
				   <button type="button" class="btn btn-primary navbar-btn" 
					  data-toggle="dropdown">
					  Categories <span class="caret"></span>
				   </button>
				   <ul id="Categories" class="dropdown-menu pull-right" role="menu">
					 
				   </ul>
				</div>
			 </form>
			 
			 
			 
			  <!-- LOG IN and Register -->
			  <!-- LOG IN and Register -->
			  <!-- LOG IN and Register -->
			 <!-- LOG IN and Register -->
			  <div class = "navbar-collapse collapse" id="navbar-collapse" >
                                <ul class="nav navbar-nav navbar-right">
                                                <li class="dropdown">
                                                        <a class="dropdown-toggle" href="#" data-toggle="dropdown" >
                                                                Log In 
                                                                <strong class="caret">
                                                                </strong>
                                                        </a>
                                                        <div class="dropdown-menu" style="padding: 15px; padding-bottom: 0px;" >
                                                                <form class="navbar-form form-inline" method="post" id="signin-form"  >
                                                                        <input style="margin-bottom: 15px;" class="username" type="text" placeholder="Username" id="username" name="username">
                                                                        <input style="margin-bottom: 15px;" class="password" type="password" placeholder="Password" id="password" name="password">
                                                                        <label class="string optional" for="user_remember_me">
                                                                        <input style="float: left; margin-right: 10px;" type="checkbox" name="remember-me" id="remember" value="1">
                                                                         Remember me</label>
                                                                        <input class="btn btn-primary btn-block" type="button" id="user-btn"  value="Sign In" onclick = "sendRequest()" />
                                                                </form>
                                                        </div>
                                                </li>
                                                <li><a data-toggle="modal" data-target="#myModal">
                                                        <span class="glyphicon glyphicon-user"></span> Sign Up</a>
                                                </li>
                                </ul>
                        </div>  
                </div>
    </div>

	<!-- Modal Dialogue Window When you click Register -->
	<form action="http://localhost:8080/Prodavalnik/NewADServlet" method="post" enctype="multipart/form-data">
	<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
					<h1 class="modal-title text-center" id="myModalLabel">Registration</h1>
				</div>
					<div class="modal-body">
							 <!-- Username input-->
						<div class="control-group text-center">
								<label class="control-label" for="textinput"><font color="#d9534f;">User name:*</font></label>
								<div class="controls">
								  <input id="username-reg" name="textinput" type="text" placeholder="" class="input-medium">
								</div>
								<br/>
						  <!-- Password input-->
							<label class="control-label" for="passwordinput"><font color="#d9534f;">Password:*</font></label>
							<div class="controls">
							  <input id="password-reg" name="passwordinput" type="password" placeholder="password" class="input-medium">
							  <span class="help-block"><font color="#d9534f;">*The password must have at least 8 characters, at least 1 digit(s), at least 1 lower case letter(s), 
							  at least 1 upper case letter(s)
							  </font></span>
							</div>
						  <!-- Address input-->
							<label class="control-label" for="textinput">Address:</label>
							<div class="controls">
							  <input id="address-reg" name="textinput" type="text" placeholder="" class="input-medium">
							</div>
							<br/>
						  <!-- Phone input-->
							<label class="control-label" for="textinput">Phone Number:</label>
							<div class="controls">
							  <input id="phone-reg" name="textinput" type="tel" placeholder="+359" class="input-medium">
							</div>
							<br/>
						  <!-- Email input-->
							<label class="control-label" for="textinput"><font color="#d9534f;">E-mail:*</font></label>
							<div class="controls">
							  <input id="email-reg" name="textinput" type="email" placeholder="" class="input-medium">
							</div>
						</div>
						<br/>
						<div class="modal-footer">
							<button id="submit-reg" name="singlebutton" type="button" class="btn btn-success" onclick = "sendRegistration()" >Submit</button>
							<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
					    </div>
				</div>
			</div>
		</div>
	</div>
	</form>
	  <div class = "container-fluid">
                <div class="row">
                        <div class="col-md-12">
                                        <!--- Left column -->
                                        <div class="col-md-3" >
                                          <!-- Left column -->
                                          <strong><i class="glyphicon glyphicon-wrench"></i> Categories</strong>
                                          <hr>
                                          <ul id="CategoriesMenu" class="list-unstyled">
                                                
                                          </ul>
                                        

                                        </div>
                                                                                
                                        <!-- Slide Show column -->
                                <div class="col-md-6" id="col-md-6">
                                                <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
                                                  <!-- Indicators -->
                                                  <ol class="carousel-indicators">
                                                        <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
                                                        <li data-target="#carousel-example-generic" data-slide-to="1"></li>
                                                        <li data-target="#carousel-example-generic" data-slide-to="2"></li>
                                                  </ol>

                                                  <!-- Wrapper for slides -->
                                                  <div class="carousel-inner" role="listbox">
                                                        <div class="item active">
                                                          <img src="img/black friday 1.jpg" alt="...">
                                                          <div class="carousel-caption">
                                                                ...
                                                          </div>
                                                        </div>
                                                        <div class="item">
                                                          <img src="img/black friday 2.jpg" alt="...">
                                                          <div class="carousel-caption">
                                                                ...
                                                          </div>
                                                        </div>
                                                        <div class="item">
                                                          <img src="img/sale.jpg" alt="...">
                                                          <div class="carousel-caption">
                                                                ...
                                                          </div>
                                                        </div>
                                                        
                                                  </div>

                                                  <!-- Controls -->
                                                  <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
                                                        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
                                                        <span class="sr-only">Previous</span>
                                                  </a>
                                                  <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
                                                        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
                                                        <span class="sr-only">Next</span>
                                                  </a>
                                                </div>
                
                <!-- Custom Thumbnail -->                               
                <div id="Products"class = "container-gallery">                  
                
                </div>
	</body>
</html>